<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>匹配结果</title>
    <link rel="stylesheet" href="../css/result.css">
</head>
<body>
    <div class="container">
        <h1 id="title">你的守护神兽是：</h1>
        <p id="matched-animal" class="highlight"></p>
        <div id="description" class="hidden">
            <!-- 动态加载文案 -->
        </div>
        <button id="startVideoBtn" class="hidden" onclick="playVideo()">观看守护兽视频</button>
        <button id="retryBtn" class="hidden" onclick="retryTest()">再测一次</button>
    </div>
    <video id="guardian-video" class="hidden" controls>
        <!-- 预设的视频资源 -->
        <source src="" id="video-source" type="video/mp4">
        您的浏览器不支持视频播放。
    </video>
    <div class="feedback-container">
        <!-- 反馈按钮 -->
        <button class="feedback-btn" id="feedbackBtn">反馈与建议</button>
    
        <!-- 反馈弹窗 -->
        <div class="feedback-popup hidden" id="feedbackPopup">
            <div class="feedback-content">
                <h2>反馈与建议</h2>
                <textarea id="feedbackText" placeholder="请输入您的反馈..." rows="5"></textarea>
                <div class="feedback-actions">
                    <button class="submit-btn" id="submitFeedback">提交</button>
                    <button class="cancel-btn" id="closeFeedback">取消</button>
                </div>
            </div>
        </div>
    </div>

    <div class="header">
        <button id="logoutBtn" class="logout-btn">退出登录</button>
    </div>
    
    <script src="../js/result.js"></script>

</body>
</html>
